import { storeToRefs } from "pinia"
import { useMainStore } from "@/store/main"

export default () => {
  const mainStore = useMainStore()
  const { canvasPercentage, canvasDragged, canvasScale } = storeToRefs(mainStore)

  /**
   * 缩放画布百分比，更改可视区域显示百分比
   * @param command 缩放命令：放大、缩小
   */
  const scaleCanvas = (command: '+' | '-') => {
    let percentage = canvasPercentage.value
    const step = 5
    const max = 150
    const min = 30
    if (command === '+' && percentage <= max) percentage += step
    if (command === '-' && percentage >= min) percentage -= step
    mainStore.setCanvasPercentage(percentage)
  }

  /**
   * 设置画布缩放比例，但不是直接设置该值，而是通过设置画布可视区域百分比来动态计算
   * @param value 目标画布缩放比例
   */
  const setCanvasScalePercentage = (value: number) => {
    // 不懂？？？为什么要除canvasScale
    const percentage = Math.round(value / canvasScale.value * canvasPercentage.value) / 100
    mainStore.setCanvasPercentage(percentage)
  }

  /**
   * 重置画布尺寸和位置
   */
  const resetCanvas = () => {
    mainStore.setCanvasPercentage(90)
    if (canvasDragged) mainStore.setCanvasDragged(false)
  }
  return {
    scaleCanvas,
    setCanvasScalePercentage,
    resetCanvas
  }
}